<html lang="en" xmlns="http://www.w3.org/1999/html">
    <head>
        <meta charset="UTF-8">
    </head>

    <body>
    <h1>司机监听测试页面-模拟司机客户端</h1>
    <button onclick="setMessageContent('鼠标点我了')">测试消息展示</button>
    <div id ="message">展示消息推送的地方：</br></div>


    <button onclick="closeSource()">关闭资源</button>
    </body>
</html>

<script>
    source = null;
    // driverId = "1859058039166873601";
    driverId = "1861040638496178178";
    identity = 1;
    // 使用SSE服务实现服务端向客户端的信息的发送。
    if(window.EventSource) { // 是否支持SSE服务
        source = new EventSource("http://localhost:8101/connect?driverId=" + driverId + "&identity=" + identity); // 自动发起连接，服务端需要返回SSE连接对象
    }else {
        setMessageContent("该浏览器不支持SSE服务");
    }

    // 监听服务
    source.addEventListener("message", function (e) {
        content = e.data;
        console.log("消息内容：" + content);
        setMessageContent(content)
    })

    function closeSource() {
        if(null === source) {
            return;
        }

        source.close();
        //发送ajax请求关闭服务器 连接的资源
        var httpRequest = new XMLHttpRequest();
        httpRequest.open("get", "http://localhost:8101/connect/close?driverId=" + driverId + "&identity=" + identity);
        httpRequest.send();
        httpRequest.close();
    }



    function setMessageContent(content) {
        document.getElementById("message").innerHTML += (content + '</br>');
    }
</script>